<template>
  <van-search class="search" v-model="value" placeholder="请输入商品名称" clearable show-action @search='onSearch' @cancel='onCancel'></van-search>
  
</template>

<script>
import {Search} from 'vant'
export default {
 components:{
    [Search.name]:Search
  },
   methods:{
    onSearch(val){
     console.log(val)
    },
    onCancel(){
      console.log('取消事件')
    },
    clear(){
      console.log('清楚')
    }
  }
}
</script>

<style lang='less' scoped>
.van-search{
    padding-top: 5px;
    .van-search__content{
      border-radius: 5px;
      height: 30px;
      // background-color: aqua;
    }
  }
</style>